<template>
	<view class="campaign"
		:style="{paddingTop: paddingHeight + 'px',backgroundColor: bgColor,minHeight: minHeight + 'px'}">
		<nav-bar></nav-bar>
		<view class="t-h-container">
			<view class="t-h-title">
				选择运动记录
			</view>
			<view class="t-h-sub-title">
				测量的记录属于哪次运动?
			</view>
			<view class="record_l" v-if="dataList.length">
				<view class="r_t">
					运动记录
				</view>
				<view class="item" v-for="(item,index) in dataList" :key="index" @click="goConnect(item.id)">
					<u-image width="64rpx" height="64rpx" :showMenuByLongpress="false" :src="item.icon"
						:lazy-load="true"></u-image>
					<view class="info">
						<view class="i_t">
							{{ item.sportProject }}
						</view>
						<view class="i-b">
							<view class="n-d">
								{{ item.kcal }}
							</view>
							<view class="unit">
								kcal
							</view>
						</view>
					</view>
					<u-image width="40rpx" @click.stop="goUpdate(item)" height="40rpx" :showMenuByLongpress="false"
						src="http://oss.antaimedical.com/images/static/2024/07/6690f95aeb14d0f049f44d53yFphcff3hkUg8d15e8e9a201a1d09544e4ab5ce29646.png"
						:lazy-load="true"></u-image>
				</view>
			</view>
			<view class="none_tip" v-else>
				<u-image width="486rpx" height="486rpx" :showMenuByLongpress="false"
					src="http://oss.antaimedical.com/images/static/2024/06/6673d50deb14d0f049f44d22tECVvYkyiCP3008d459dcb72a39938976faf2fb8d00a.png"
					:lazy-load="true"></u-image>
			</view>
		</view>
		<view class="large_button" @click="goAdd">
			添加运动记录
		</view>
	</view>
</template>

<script>
	import {
		findSportDayRecord
	} from '@/api/index.js'
	export default {
		data() {
			return {
				paddingHeight: uni.getStorageSync('navbarHeight'),
				userId: uni.getStorageSync("userId"),
				bgColor: '#FFFFFF',
				minHeight: 0,
				tag: undefined,
				dataList: []
			}
		},
		onLoad(OPTIONS) {
			const systemInfo = uni.getSystemInfoSync();
			this.minHeight = systemInfo.windowHeight
			this.tag = OPTIONS.tag
		},
		onShow() {
			this.fetchData()
		},
		methods: {
			async fetchData() {
				uni.showLoading({
					title: '加载中...'
				})
				let params = {
					userId: this.userId
				}
				try {
					const res = await findSportDayRecord(params)
					if (res.code == 200) {
						if (res.data.length) {
							this.dataList = res.data
							this.bgColor = '#FAFAFA'
						} else {
							this.dataList = []
							this.bgColor = '#FFFFFF'
						}
					}
				} catch (e) {
					//TODO handle the exception
				}
				uni.hideLoading()
			},
			// 跳转连接
			goConnect(id) {
				uni.redirectTo({
					url: `/pagesA/health/device/connect/index?tag=${this.tag}&sportId=${id}`
				})
			},
			// 去添加运动记录
			goAdd() {
				uni.navigateTo({
					url: `/pagesA/health/device/info/campaign/add?tag=${this.tag}`
				})
			},
			goUpdate(info) {
				uni.navigateTo({
					url: `/pagesA/health/device/info/campaign/update?info=${JSON.stringify(info)}`
				})
			}
		}
	}
</script>


<style lang="scss">
	page {
		min-height: 100%;
	}
</style>
<style lang="scss" scoped>
	.campaign {
		.none_tip {
			margin: 76rpx auto 0;
			display: flex;
			justify-content: center;
		}

		.large_button {
			position: fixed;
			bottom: 76rpx;
			left: 50%;
			transform: translateX(-50%);
		}
	}
</style>